<template>
    <div>
        <div class="page">
            <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="currentPage"
                :page-sizes="[10, 15, 20, 30]"
                :page-size="10"
                background
                layout=" prev, jumper, next, sizes, total"
                :total="totalNum">
            </el-pagination>
        </div>
    </div>
</template>

<script>
export default {
    // props:{
    //     totalNum: Number
    // },
    data() {
        return{
            currentPage:1,
            totalNum:0
        }
    },
    methods:{
        handleCurrentChange() {
            this.$emit('PageChange')
        },
        handleSizeChange() {
            console.log('每页条数改变触发');
        }
    }
}
</script>

<style scoped>
    .page{
        text-align: right;
        margin-top: 1.25rem;
    }
    .el-pagination__jump{
        margin-left: 0px!important;
    }
</style>
